<!DOCTYPE html>
<html lang="zh-CN" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <meta content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=0" name="viewport"/>
    <meta content="yes" name="apple-mobile-web-app-capable"/>
    <meta content="black" name="apple-mobile-web-app-status-bar-style"/>
    <meta content="telephone=no" name="format-detection"/>
    <script th:src="@{/webjars/jquery/3.0.0/jquery.js}"></script>
    <link th:href="@{/css/ydui.css}" rel="stylesheet">
    <script th:src="@{/js/ydui.flexible.js}"></script>
</head>
<body>
<section class="g-flexview">

    <header class="m-navbar">
        <a href="#" class="navbar-item" onclick="back_op();return false;"><i class="back-ico"></i>返回</a>
        <div class="navbar-center"><span class="navbar-title">我收藏的</span></div>
    </header>

    <section id="J_List" class="g-scrollview">
        <!--/*@thymesVar id="product" type="com.backend.models.Product"*/-->
        <!--/*@thymesVar id="collect" type="com.backend.models.ProductCollect"*/-->
        <!--/*@thymesVar id="productCollects" type="java.util.ArrayList<com.backend.models.ProductCollect>"*/-->
        <article class="m-list list-theme4">
            <a href="javascript:;" class="list-item" th:each="collect : ${productCollects}" th:onclick="open_detail('[[${collect.product.id}]]');return false;">
                <!--/*@thymesVar id="CommonStringUtils" type="com.backend.utils.CommonStringUtils"*/-->
                <div class="list-img">
                    <img th:src="${collect.product.showImg == null} ? '' : ${collect.product.showImg}">
                </div>
                <div class="list-mes">
                    <h3 class="list-title" th:text="${collect.product.title}"></h3>
                    <div class="list-mes-item">
                        <div style="width: 98%;">
                            <span class="list-price"><em>¥</em><font th:text="${collect.product.price}"></font></span>
                            <span class="list-del-price" th:if="${collect.product.buyPrice}" th:text="${collect.product.buyPrice}"></span>
                            <span th:onclick="cancel_collect('[[${collect.id}]]',event);return false;" th:id="${'cancel_collect_' + collect.id}" class="btn btn-warning self_span" style="float: right;margin-top: .6rem;"><i class="icon-star-outline"></i>&nbsp;取消收藏</span>
                            <span th:onclick="collect('[[${collect.id}]]',event);return false;" th:id="${'collect_' + collect.id}" class="btn btn-warning self_span" style="float: right;margin-top: .6rem;display: none;"><i class="icon-star"></i>&nbsp;立即收藏</span>
                        </div>
                    </div>
                </div>
            </a>
        </article>
    </section>
</section>
<script th:src="@{/js/ydui.js}"></script>
<script th:inline="javascript">
    !function () {
        $('.m-list').find('img').lazyLoad({binder: '.g-scrollview'});
    }();

    function cancel_collect(collect_id,event){
        event.stopPropagation();
        var url = "/app/collect_by_collect_id/";
        var post_param = {"collect_id" : collect_id,"value" : "false"};
        $.post(url,post_param,function (res) {
            if(res == 'success'){
                var cancel = "#cancel_collect_"+collect_id;
                var coolect = "#collect_"+collect_id;
                $(cancel).hide();
                $(coolect).show();
            }
        });

    }

    function collect(collect_id,event){
        event.stopPropagation();
        var url = "/app/collect_by_collect_id/";
        var post_param = {"collect_id" : collect_id,"value" : "true"};
        $.post(url,post_param,function (res) {
            if(res == 'success'){
                var cancel = "#cancel_collect_"+collect_id;
                var coolect = "#collect_"+collect_id;
                $(coolect).hide();
                $(cancel).show();
            }
        });
    }

    function back_op(){
        window.collectProducts.finishActivity();
    }

    function open_detail(product_id){
        window.collectProducts.openDetail(product_id);
    }
</script>
</body>
</html>